<template>
	<view>
		<u-modal :show="show" cancelColor="#555" confirmColor="#1BA95B" :showCancelButton="true" :title="title"
			@cancel="cancel" @confirm="confirm"></u-modal>
		<!-- 头部 -->
		<view class="toubox" @click="jumper('/pages_xiaoshou/gerenzl')">
			<view class="flexbetween">
				<view class="flexleft">
					<view class="touxiang margin_right2">
						<image :src="userInfo.avatar_text" mode=""></image>
					</view>
					<view class="">
						<view class="bigtext xiaobai fonweight">{{userInfo.nickname}}</view>
						<view class="ershiba xiaobai nofonweight margin_top">{{userInfo.mobile}}</view>
					</view>
				</view>
				<u-icon name="arrow-right" color="#FFFFFF"></u-icon>
			</view>
		</view>
		<!--  -->
		<view class="mainpadding ffffff margin_top">
			<!--俱乐部  -->
			<!-- <view class="lanbox flexbetween ">
				<view class="">
					<view class="sanshier xiaobai nofonweight">张三篮球俱乐部</view>
					<view class="smalltext xiaobai nofonweight margin_top1">我的俱乐部</view>
				</view>
				<view class="banibtn" @click="jumper('/pages_xiaoshou/julebu')">立即查看</view>
			</view> -->
			<!-- 我的钱包 -->
			<view class="lanbox flexbetween ">
				<view class="">
					<view class="sanshier xiaobai nofonweight">我的钱包</view>
					<!-- <view class="smalltext xiaobai nofonweight margin_top1">所在场馆：张三游泳场馆</view> -->
				</view>
				<view class="banibtn" @click="jumper('/pages_mypage/wodeyue')">立即查看</view>
			</view>
			<!-- <view class="xiahuaxian flexbetween margin_top" @click="jumper('/pages_xiaoshou/xiugaimm')">
				<view class="ershiba xiaohei nofonweight ">修改密码</view>
				<u-icon name="arrow-right"></u-icon>
			</view> -->
			<view class="xiahuaxian flexbetween margin_top" @click="jumper('/pages/system/system?type=1')">
				<view class="ershiba xiaohei nofonweight ">用户协议</view>
				<u-icon name="arrow-right"></u-icon>
			</view>
			<view class="xiahuaxian flexbetween margin_top" @click="jumper('/pages/system/system?type=3')">
				<view class="ershiba xiaohei nofonweight ">关于我们</view>
				<u-icon name="arrow-right"></u-icon>
			</view>
			<view class="xiahuaxian flexbetween margin_top" @click="jumper('/pages/system/system?type=2')">
				<view class="ershiba xiaohei nofonweight ">隐私协议</view>
				<u-icon name="arrow-right"></u-icon>
			</view>
			<view class="flexbetween margin_top" @click="yonghuduan">
				<view class="ershiba xiaohei nofonweight ">进入用户端</view>
				<u-icon name="arrow-right"></u-icon>
			</view>
			<!-- <view class="ershiba xiaohei nofonweight margin_top textcenter" @click="show = true">退出登录</view> -->
		</view>
		<tabbarxsd current=1></tabbarxsd>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				show: false,
				title: '确定要退出当前账户么？',
				userInfo:{}
			}
		},
		onLoad() {
			uni.hideTabBar()
			this.userinfomsg()
		},
		methods: {
			userinfomsg() {
				httpRequest.request('/api/user/index', 'GET', {}).then(res => {
					this.userInfo = res.data
				})
			},
			yonghuduan(){
				uni.switchTab({
					url:"/pages/homepage"
				})
			},
			// 跳转隐私协议
			tzysxy(){
				uni.navigateTo({
					url:'/pages_xiaoshou/yinsixy'
				})
			},
			jumper(url) {
				uni.navigateTo({
					url: url
				})
			},
			// 退出登录
			cancel() {
				this.show = false
			},
			confirm() {
				this.show = false;
				// 将存储的数据改为空达到退出登录的效果
				uni.setStorageSync('token', "");
				httpRequest.toast("退出登录成功")
				setTimeout(() => {
					uni.redirectTo({
						url: '/pages/login/login'
					})
				}, 1000)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.banibtn {
		width: 164rpx;
		height: 60rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
		font-size: 24rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: normal;
		color: #000000;
		border: 2rpx solid #FFFFFF;
	}

	.lanbox {
		padding: 38rpx 30rpx;
		background: linear-gradient(131deg, #19253E 0%, #374368 100%);
		box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(29, 44, 76, 0.2);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}

	page {
		background: #F5F5F5;

	}

	.touxiang {
		width: 176rpx;
		height: 176rpx;
		border-radius: 50%;

		image {
			border-radius: 50%;
			width: 100%;
			height: 100%;
		}
	}

	.toubox {
		background: #1BA95B;
		padding: 90rpx 64rpx 30rpx;
	}
</style>
